.app-container {
  width: 100%;
  padding: 8px;
  background: #ececec;
}

.box-card {
  width: 100%;
  padding: 14px;
  border-radius: 2px;
  border: 1px solid #e6ebf5;
  overflow: hidden;
  color: #303133;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  .titleHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 14px;
    color: #3c3c3c;
    line-height: 24px;
    text-align: left;
    .titleLeft {
      font-weight: bold;
    }
  }
}
.title_content {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  span {
    margin-right: 12px;
  }
}
.marginTop12 {
  margin-top: 8px;
}
.search_Button {
  font-weight: 400;
  font-size: 12px;
  line-height: 12px;
  color: #ffffff;
  border-radius: 2px 2px 2px 2px;
}
.confirm {
  background-color: rgba(76, 200, 126, 1);
  margin-right: 10px;
}
.confirm_No {
  background-color: #eeeeee;
  color: #6e6e6e;
}
.examine-button {
  display: flex;
  justify-content: center;
  align-items: center;
}
// 历史版本 table
.tab-page {
  .box-list-container {
    display: flex;
  }

  .box-list {
    display: flex;

    flex: 1;
    flex-direction: column;

    &:last-child {
      margin-left: 10px;
    }
  }

  .box {
    overflow: hidden;

    margin-bottom: 10px;
    border-radius: 3px;

    &.border {
      border: 1px solid #e8edef;
    }

    .box-title {
      display: flex;

      padding: 0 15px;
      min-height: 40px;

      line-height: 40px;

      background: #e8edef;

      justify-content: space-between;
      align-items: center;

      .progress {
        color: #42b983;
      }

      &.hover {
        color: red;
      }

      &.sub {
        display: flex;

        background: #e8edef;

        justify-content: space-between;
        align-items: center;
      }
    }
  }

  .box-content {
    table {
      border-collapse: collapse;

      border-width: 1px;
      border-color: #666;
      width: 100%;

      td,
      th {
        border: 0.5px solid #eee;
        min-width: 50px;

        font-size: 12px;
      }

      th {
        padding: 10px; // background: #fff8e6;
      }

      td {
        padding: 5px;

        .col {
          display: flex;

          span {
            display: inline-block;

            margin-top: 5px;
          }
        }

        &.center {
          text-align: center;
        }

        &.lb {
          width: 100px;
        }
      }

      .el-select,
      .el-input,
      .el-textarea {
        width: 80%;
      }
    }

    .el-icon-lock,
    .el-icon-unlock {
      margin-top: -10px;
      margin-left: 10px;

      font-size: 30px;
      vertical-align: bottom;

      cursor: pointer;
    }

    .el-icon-lock {
      color: red;
    }

    .el-icon-unlock {
      color: #42b983;
    }
  }

  .image-list {
    display: flex;

    flex-wrap: wrap;

    .image-item {
      display: flex;

      // overflow: hidden;

      position: relative;

      margin-right: 10px;
      margin-bottom: 10px;
      border: 1px dashed #ccc;
      width: 180px;
      min-height: 180px;

      align-items: center;
      // height: 180px;
      &.border_error {
        border: 2px dashed red;
      }

      a {
        display: inline-flex;

        // height: 100%;

        align-items: center;
      }

      img {
        width: 100%;
      }

      .size {
        position: absolute;
        bottom: 0;
        left: 0;

        padding: 5px;
        width: 100%;

        color: #fff;
        background: rgba(#000, 0.5);

        .tt {
          display: flex;

          justify-content: space-between;
        }
      }
    }

    .el-icon-close {
      position: absolute;
      top: 0;
      right: 0;

      font-size: 20px;

      color: #fff;
      background: rgba(#000, 0.3);

      cursor: pointer;
    }
  }

  :deep(.file-upload) {
    .input {
      width: 60%;
      min-width: 300px;
    }
  }

  input[type="file"] {
    display: inline-block;
    overflow: hidden;

    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 5px;

    font-size: 12px;
    line-height: normal;
    text-overflow: ellipsis;

    color: #555;
    background-color: #fff;
    background-image: none;
  }

  .btn-qudao {
    border: 1px dashed red;
    padding: 10px;

    font-size: 10px;

    color: red;

    cursor: pointer;
  }

  .btn-upload {
    display: flex;

    position: relative;

    border: 1px dashed #42b983;
    width: 180px;
    height: 180px;

    font-size: 20px;

    color: #42b983;

    align-items: center;
    justify-content: center;

    input[type="file"] {
      position: absolute;

      width: 100%;
      height: 100%;

      opacity: 0;

      cursor: pointer;
    }
  }

  .btn-list {
    display: flex;

    margin-top: 5px;

    align-items: center;

    // justify-content:center;
    .el-tag {
      margin-right: 5px;
    }
  }

  .el-form {
    border: 1px solid #eee;
  }

  .el-form-item {
    margin: 0;
    padding: 5px;
  }

  .el-form-item:nth-child(even) {
    background-color: #f1f5f7;
  }

  .footer {
    display: flex;

    padding: 10px;

    align-items: center;
    justify-content: center;
  }

  .my-upload-list {
    display: flex;
  }

  .my-upload {
    display: flex;

    width: 120px;

    flex-direction: column;
    align-items: center;

    .image-item {
      position: relative;

      a {
        display: flex;
        overflow: hidden;

        border: 1px dashed #ccc;
        width: 100px;
        height: 100px;

        align-items: center;
      }

      img {
        width: 100%;
      }
    }

    .el-icon-close {
      position: absolute;
      top: 0;
      right: 0;

      font-size: 20px;

      color: #fff;
      background: rgba(#000, 0.3);

      cursor: pointer;
    }

    .btn-upload {
      display: flex;

      position: relative;

      border: 1px dashed #42b983;
      width: 100px;
      height: 100px;

      font-size: 20px;

      color: #42b983;

      align-items: center;
      justify-content: center;

      input[type="file"] {
        position: absolute;

        width: 100%;
        height: 100%;

        opacity: 0;

        cursor: pointer;
      }
    }

    .tips {
      font-weight: bold;
      text-align: center;

      color: #666;
    }
  }
}

// basic
.basic_info_box {
  display: flex;
  align-items: center;
  color: #6e6e6e;
  .lt {
    margin-left: 12px;
    width: 280px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  }
  .rt {
    margin-left: 12px;
    padding-left: 12px;
    border-left: 1px solid #dedede;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  }
}

.basic {
  font-size: 12px;
  color: #4cc87e;
}
.el-tag {
  cursor: pointer;
  // display: flex;
  // align-items: center;
}

.thead {
  background: #f8f8f8;
  // color: #fff;
}

.table-grab {
  border-collapse: collapse;

  margin: 2px 40px;
  width: 100%;
  max-width: 1100px;

  td,
  th {
    border: 1px dashed #ccc;
    padding: 0 5px;
  }
}

//
.steps_title {
  color: #3c3c3c;
  font-size: 12px;
  margin: 12px 0;
  font-weight: 500;
}
.icon {
  color: #f0a03c;
  margin-right: 8px;
  background-color: #ffffff;
}
.icon_2 {
  color: #ccc;
  cursor: pointer;
}
.steps {
  margin-top: 12px;
  padding: 12px;
  background-color: #f9fefb;
  color: #4cc87e;
  // font-size: 2px;
}
// :deep(.ant-steps-item-content .ant-steps-item-title:hover) {
//   // font-size: 12px;
//   color: #4CC87E;
// }
// :deep(:where(.css-dev-only-do-not-override-19iuou).ant-steps.ant-steps-small .ant-steps-item-description:hover){
//   color: #4CC87E;
// }
// :deep(:where(.css-dev-only-do-not-override-19iuou).ant-steps.ant-steps-small .ant-steps-item-title:hover) {
//   color:  #4CC87E;
// }

:deep(
    .ant-steps-item-finish
      > .ant-steps-item-container
      > .ant-steps-item-content
      > .ant-steps-item-title::after
  ) {
  border: 1px solid #4cc87e;
}
:deep(
    :where(.css-dev-only-do-not-override-1hsjdkk).ant-steps
      .ant-steps-item-finish
      .ant-steps-item-icon
  ) {
  background-color: #4cc87e;
  border: 1px solid #4cc87e !important;
}
:deep(.ant-steps-item-process .ant-steps-item-icon) {
  background-color: #4cc87e;
  border: 1px solid #4cc87e !important;
}
// :deep(.ant-steps-item-process:hover){
//   // background-color:#4CC87E;
//   .ant-steps-item-icon{
//     border: 1px solid #0f0f0f !important;

//   }
// }
:where(.css-dev-only-do-not-override-19iuou).ant-form-item
  :deep(.ant-form-item-label > label) {
  color: #6e6e6e;
}

:deep(
    :where(.css-dev-only-do-not-override-1hsjdkk).ant-steps.ant-steps-small
      .ant-steps-item-description
  ) {
  font-size: 12px;
  color: #6e6e6e;
}
:deep(.ant-steps-item-process .ant-steps-item-icon) {
  background-color: #4cc87e !important;
}
// :deep(.ant-steps-item-finish){
//   color:  #4CC87E !important;
// }
// :deep(.ant-steps.ant-steps-small .ant-steps-item-finish:hover){
//   color:  #4CC87E !important;
// }
// :deep(.ant-steps.ant-steps-small .ant-steps-item-wait:hover){
//   .ant-steps-item-icon{
//     color:  #4CC87E !important;
//     border: 1px solid #4CC87E !important;
//     background-color:#4CC87E !important;
//   }
//   .ant-steps-item-content>.ant-steps-item-title
//   .ant-steps-item-content>.ant-steps-item-description
//   {
//     color:  #4CC87E !important;
//   }
// }

// :deep(:where(.css-dev-only-do-not-override-1hsjdkk).ant-steps.ant-steps-small .ant-steps-item-title:hover){
//   color:  #4CC87E !important;
// }

// :deep(.ant-steps-item-description:hover){
//   font-size: 12px;
//   color: #4CC87E;
// }
// :deep(.ant-steps-item-active:hover .ant-steps-item-title .ant-steps-item-container) {
//   // background-color: #4CC87E; /* 或者您希望的背景颜色 */
//   color: #4CC87E !important;
// }

// :deep(.ant-steps-item-content> .ant-steps-item-title:hover ){
//   font-size: 18px;
//   font-weight: bolder;
//   // border-color: transparent; /* 去掉边框颜色 */
//   color: #4CC87E;
// }
// :deep(.ant-steps-item-content> .ant-steps-item-description:hover ){
//   font-size: 18px;
//   font-weight: bolder;
//   // border-color: transparent; /* 去掉边框颜色 */
//   color: #4CC87E;
// }
